<#include "../common/layout/__mainlayout.html">
<#include "../common/__pagination.html">

<#assign pageBreadCrumbs>
    <li class="active"><a href="#">用户权限</a></li>
    <li class="active">用户管理</li>
</#assign>

<#assign pageCss>
    <!-- page specific plugin styles -->
    <link rel="stylesheet" href="${contextPath}/static/admin/assets/css/jquery-ui.custom.css" />
    <link rel="stylesheet" href="${contextPath}/static/admin/assets/css/chosen.css" />
    <link rel="stylesheet" href="${contextPath}/static/admin/assets/css/datepicker.css" />
</#assign>

<#assign pageJavascript>
    <script type="text/javascript">
        $(document).ready(function(){
            $('[data-rel=tooltip]').tooltip();

            if(!ace.vars['touch']) {
                $('.chosen-select').chosen({allow_single_deselect:true});
            }

            // 清除远程modal数据
            $("#editModal").on("hidden.bs.modal", function(){
                $(this).removeData("bs.modal");
            });

            // 删除按钮
            $("a.delete").on(ace.click_event, function(e){
                var currentA = this;
                e.preventDefault();
//                bootbox.setDefaults({locale:"zh_CN"});
                bootbox.confirm({
                            message: "确定删除该用户?",
                            buttons: {
                                confirm: {
                                    label: "确定",
                                    className: "btn-primary btn-sm"
                                },
                                cancel: {
                                    label: "取消",
                                    className: "btn-sm"
                                }
                            },
                            callback: function(result) {
                                if(result) window.location.href = $(currentA).attr("href");
                            }
                        }
                );
            });
        });

        function page(pageNum) {
            $("#page").val(pageNum);
            $("#searchForm").submit();
        }
    </script>
</#assign>

<@mainlayout pageBreadCrumbs=pageBreadCrumbs pageCss=pageCss pageJavascript=pageJavascript currentMenu="userRoleFlag-userFlag">
    <div class="row">
        <div class="col-xs-12">
            <form id="searchForm" class="form-search form-inline" method="post">
                <input id="page" name="page" type="hidden"/>
                <label>用户名:</label><input type="text" name="user.username" class="input-sm input-small" value="${user.username!}"/>&nbsp;
                <label>姓名:</label><input type="text" name="user.username" class="input-sm input-small" value="${user.name!}"/>&nbsp;
                <select name="user.type" class="chosen-select input-md" data-placeholder="用户类型">
                    <option value=""></option>
                    <option value="0"<#if user.type?? && user.type = '0'>selected="selected"</#if>>普通用户</option>
                    <option value="1"<#if user.type?? && user.type = '1'>selected="selected"</#if>>管理员</option>
                </select>&nbsp;

                <select name="user.login_status" class="chosen-select input-md" data-placeholder="在线状态">
                    <option value=""></option>
                    <option value="0"<#if user.login_status?? && user.login_status = '0'>selected="selected"</#if>>离线</option>
                    <option value="1"<#if user.login_status?? && user.login_status = '1'>selected="selected"</#if>>在线</option>
                </select>&nbsp;

                <select name="user.enable" class="chosen-select input-md" data-placeholder="启用状态">
                    <option value=""></option>
                    <option value="0"<#if user.enable?? && user.enable = '0'>selected="selected"</#if>>启用</option>
                    <option value="1"<#if user.enable?? && user.enable = '1'>selected="selected"</#if>>停用</option>
                </select>&nbsp;

                <input type="submit" class="btn btn-sm btn-primary" value="查询"/>&nbsp;
                <a href="${contextPath}/admin/user/view" class="btn btn-sm btn-warning" data-toggle="modal" data-target="#editModal"><i class="ace-icon fa fa-plus"></i>添加</a>
            </form>
            <table id="contentTable" class="table table-striped table-bordered table-hover">
                <thead>
                <tr>
                    <th width="40" align="right" >用户ID</th>
                    <th width="100" align="left" >用户名</th>
                    <th width="70" align="left" >昵称</th>
                    <th width="70" align="left" >姓名</th>
                    <th width="60" align="left" >手机号</th>
                    <th width="30" align="center" >性别</th>
                    <th width="80" align="center" >生日</th>
                    <th width="70" align="center" >用户类型</th>
                    <th width="100" align="center" >创建时间</th>
                    <th width="100" align="center" >更新时间</th>
                    <th width="100" align="center" >最后登陆时间</th>
                    <th width="80" align="center" >最后登陆IP</th>
                    <th width="50" align="center" >在线状态</th>
                    <th width="50" align="center" >帐号状态</th>
                    <th width="40" align="center" >操作</th>
                </tr>
                </thead>

                <tbody>
                <#list pageList.list as user>
                    <tr>
                        <td>${user.id!}</td>
                        <td>${user.username!}</td>
                        <td>${user.nickname!}</td>
                        <td>${user.name!}</td>
                        <td>${user.mobile!}</td>
                        <td><#if user.sex == '0'> <div>男</div> <#else> <div>女</div> </#if></td>
                        <td>${user.birthday!}</td>
                        <td><#if user.type == '0'> <div>普通用户</div> <#else> <div>管理员</div> </#if></td>

                        <td>${user.create_time?string("yyyy-MM-dd HH:mm:ss")!}</td>
                        <td><#if user.update_time??>${user.update_time?string("yyyy-MM-dd HH:mm:ss")!}</#if></td>
                        <td><#if user.last_login_time??>${user.last_login_time?string("yyyy-MM-dd HH:mm")!}</#if></td>
                        <td>${user.last_login_ip!}</td>
                        <td><#if user.login_status == '0'> <div>离线</div> <#else> <div style="color:green">在线</div> </#if></td>
                        <td><#if user.enable == '0'> <div>启用</div> <#else> <div style="color:red">停用</div> </#if></td>
                        <td>
                            <div class="hidden-sm hidden-xs action-buttons">
                                <a class="green tooltip-success edit" href="${contextPath}/admin/user/view?id=${user.id!}" data-rel="tooltip" title="编辑" data-toggle="modal" data-target="#editModal"><i class="ace-icon fa fa-pencil bigger-130"></i></a>
                                <a class="red tooltip-error delete" href="${contextPath}/admin/user/delete?ids=${user.id!}" data-rel="tooltip" title="删除"> <i class="ace-icon fa fa-trash-o bigger-130"></i></a>
                            </div>

                            <div class="hidden-md hidden-lg">
                                <div class="inline position-relative">
                                    <button class="btn btn-minier btn-yellow dropdown-toggle" data-toggle="dropdown" data-position="auto">
                                        <i class="ace-icon fa fa-caret-down icon-only bigger-120"></i>
                                    </button>

                                    <ul class="dropdown-menu dropdown-only-icon dropdown-yellow dropdown-menu-right dropdown-caret dropdown-close">
                                        <li><a href="${contextPath}/admin/user/view?id=${user.id!}" class="tooltip-success edit" data-rel="tooltip" title="编辑" data-toggle="modal" data-target="#editModal"> <span class="green"><i class="ace-icon fa fa-pencil-square-o bigger-120"></i></span></a></li>
                                        <li><a href="${contextPath}/admin/user/delete?ids=${user.id!}" class="tooltip-error delete" data-rel="tooltip" title="删除"> <span class="red"><i class="ace-icon fa fa-trash-o bigger-120"></i></span></a></li>
                                    </ul>
                                </div>
                            </div>
                        </td>
                    </tr>
                </#list>
                </tbody>
            </table>
        <@pagination pageList!/>
        </div>
    </div>

    <div id="editModal" class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
            </div>
        </div>
    </div>
</@mainlayout>